<template>
  <div class="pdf-viewer">
    <VuePdfApp :pdf="src" :config="config"></VuePdfApp>
  </div>
</template>

<script>
import VuePdfApp from 'vue-pdf-app';
import 'vue-pdf-app/dist/icons/main.css';

export default {
  name: 'PdfViewer',
  components: {
    VuePdfApp,
  },
  props: {
    src: {
      type: String,
      required: true,
    },
  },
  data() {
    return {
      config: {
        toolbar: {
          toolbarViewerLeft: {
            findbar: false,
            previous: true,
            next: true,
            pageNumber: true,
          },
          toolbarViewerRight: {
            presentationMode: true,
            openFile: false,
            print: true,
            download: true,
            viewBookmark: false,
          },
          toolbarViewerMiddle: {
            zoomOut: true,
            zoomIn: true,
            scaleSelectContainer: false,
          },
        },
      },
    };
  },
};
</script>

<style scoped>
.pdf-viewer {
  height: 100%;
}
</style>
